<template>
  <div>
    <h1>EventTest组件(事件的深入的学习)</h1>
    <!-- w3c认可的标签绑定click、原生DOM事件，点击事件 -->
    <pre @click="handler">
        大江东去，浪淘尽，千古风流人物.
     </pre
    >
    <!-- 自定义对于w3c规定标签没有任何意义，因为根本没有书写$emit -->
    <span @cur="handler1">我是一个span标签</span>
    <div>****************************************</div>
    <Event1 @click.native="handler2" />
    <div>****************************************</div>
    <Event2 @click="handler3" @xxx="handler4"/>
  </div>
</template>

<script type="text/ecmascript-6">
//引入子组件
import Event1 from "./Event1.vue";
import Event2 from "./Event2.vue";
export default {
  name: "EventTest",
  //注册子组件
  components: {
    Event1,
    Event2,
  },

  methods: {
    handler(event) {
      console("我是原生DOM，点击事件");
    },
    handler1() {},
    handler2() {
      alert("单机事件");
    },
    handler3(params){
      console.log('自定义事件click',params);
    },
    handler4(params){
      console.log('自定义事件实现儿子给老子送数据')
    }
  },
};
</script>
